import { getNanoid } from "@/utils/common";
import { AcceptType } from "@/stores/low-editor-comps-conf";

export const accept: AcceptType<"body"|"footer"> = {
  body:["Button", "Container", "Table", "Form"],
  footer:["Button"]
}
export const setter = [
  {
    key: "basicProps",
    label: "基本属性",
    children: [
      {
        name: "title",
        label: "标题",
        type: "input",
      },
      {
        name: "width",
        label: "尺寸",
        type: "radio",
        defaultValue: "520px",
        options: [
          { label: "标准", value: "520px" },
          { label: "小", value: "350px" },
          { label: "中", value: "800px" },
          { label: "大", value: "1100px" },
          { label: "超大", value: "90%" },
        ],
      },
    ],
  },
];

export const methods = [
  {
    name: "open",
    label: "打开弹窗",
  },
  {
    name: "close",
    label: "关闭弹窗",
  },
];

export const events = [
  {
    name: "onOk",
    label: "确认事件",
  },
  {
    name: "onCancel",
    label: "取消事件",
  },
];

export const getFooter = (parentId: string) => {
  const cancelId = getNanoid();
  const confirmId = getNanoid();
  return [
    {
      id: cancelId,
      name: "Button",
      props: {
        text: "取消",
        onClick: {
          actions: [
            {
              type: "closeDialog",
              label: "关闭弹窗",
            },
          ],
        },
        color:"default",
        variant: "outlined",
      },
      desc: "按钮",
      alias: "按钮",
      parentId,
    },
    {
      id: confirmId,
      name: "Button",
      props: {
        text: "确认",
        color:"primary",
        variant: "solid",
        onClick: {},
      },
      desc: "按钮",
      alias: "按钮",
      parentId,
    },
  ];
};

export const initModalSchema = (parentId: string) => {
  const mid = getNanoid();
  return {
    id: mid,
    name: "Modal",
    props: {
      title: "弹窗",
      width: "520px",
    },
    desc: "弹窗",
    alias: `弹窗${mid}`,
    parentId,
    footer: getFooter(mid),
  };
};
